// SPDX-License-Identifier: GPL-3.0-or-later

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Fk.RoomElement
import Fk.Pages

Flickable {
    id: root
    anchors.fill: parent

    property var selected: []
    property var active_skills: []
    property string cancelsign
    property var extra_data: ({})
    property string prompt: "SkSkills"

    signal finish

    ColumnLayout {
        anchors.fill: parent
        anchors.topMargin: 40
        anchors.leftMargin: 20
        anchors.rightMargin: 20
        anchors.bottomMargin: 20
        BigGlowText {
            id: titles
            Layout.fillWidth: true
            text: Backend.translate(prompt !== "" ? processPrompt(root.prompt) : "$Choice")
            Layout.preferredHeight: childrenRect.height + 4
            function processPrompt(prompt) {
                const data = prompt.split(":");
                let raw = Backend.translate(data[0]);
                const src = parseInt(data[1]);
                const dest = parseInt(data[2]);
                if (raw.match("%src"))
                    raw = raw.replace(/%src/g, Backend.translate(getPhoto(src).general));
                if (raw.match("%dest"))
                    raw = raw.replace(/%dest/g, Backend.translate(getPhoto(dest).general));
                if (raw.match("%arg2"))
                    raw = raw.replace(/%arg2/g, Backend.translate(data[4]));
                if (raw.match("%arg"))
                    raw = raw.replace(/%arg/g, Backend.translate(data[3]));
                return raw;
            }
        }

        GridLayout {
            Layout.alignment: Qt.AlignHCenter
            columns: 6
            Repeater {
                id: skill_buttons
                model: active_skills

                SkillButton {
                    skill: Backend.translate(modelData)
                    type: "active"
                    enabled: false
                    orig: modelData
                }
            }
        }

        Row {
            Layout.alignment: Qt.AlignHCenter
            spacing: 8
            MetroButton {
                id: detailBtn
                width: 80
                height: 35
                text: Backend.translate("Show General Detail")
                onClicked: roomScene.startCheat("../../packages/utility/qml/SkillDetail", {
                    skills: root.selected.length > 0 ? root.selected : root.active_skills
                })
            }
        }
    }

    onExtra_dataChanged: {
        if (!extra_data.data)
            return;
        active_skills = extra_data.data;
    }
}
